<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>课堂抽问</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
        }
        h1 {
            margin-top: 20px;
            color: #333;
        }
        #display {
            font-size: 3em;
            margin: 50px 0;
            color: #555;
        }
        button {
            padding: 15px 30px;
            font-size: 1.2em;
            color: #fff;
            background-color: #007bff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
        button:hover {
            background-color: #0056b3;
        }
    </style>
</head>
<body>
    <h1>课堂抽问</h1>
    <div id="display">点击开始</div>
    <button onmousedown="startRoll()" onmouseup="stopRoll()">开始</button>

    <script>
        const students = [
            { name: "闭坤泞", studyTime: 0 },
            { name: "乐海珍", studyTime: 0 },
            { name: "卢烯文", studyTime: 180 },
            { name: "翁馨", studyTime: 370 },
            { name: "闭淑婷", studyTime: 290 },
            { name: "雷晨曦", studyTime: 0 },
            { name: "陆承安", studyTime: 240 },
            { name: "谢绪池", studyTime: 0 },
            { name: "曾繁铭", studyTime: 0 },
            { name: "李美静", studyTime: 240 },
            { name: "罗春夏", studyTime: 270 },
            { name: "禤金婷", studyTime: 0 },
            { name: "邓煊妍", studyTime: 0 },
            { name: "李鑫龙", studyTime: 0 },
            { name: "罗晓琳", studyTime: 0 },
            { name: "杨雨霏", studyTime: 0 },
            { name: "何丹红", studyTime: 210 },
            { name: "梁坤坪", studyTime: 0 },
            { name: "蒙为喆", studyTime: 0 },
            { name: "玉昌源", studyTime: 0 },
            { name: "何宏正", studyTime: 0 },
            { name: "梁丽桐", studyTime: 240 },
            { name: "宁倩熙", studyTime: 0 },
            { name: "袁雅婷", studyTime: 90 },
            { name: "何简宁", studyTime: 0 },
            { name: "梁松乐", studyTime: 245 },
            { name: "农德嵩", studyTime: 0 },
            { name: "詹惠茹", studyTime: 240 },
            { name: "何思淼", studyTime: 0 },
            { name: "梁煜婷", studyTime: 300 },
            { name: "彭浩恩", studyTime: 0 },
            { name: "张基慧", studyTime: 0 },
            { name: "洪嘉仪", studyTime: 240 },
            { name: "林思燕", studyTime: 0 },
            { name: "施金鸿", studyTime: 0 },
            { name: "钟晓洁", studyTime: 184 },
            { name: "黄楚童", studyTime: 0 },
            { name: "林亦君", studyTime: 0 },
            { name: "苏嘉美", studyTime: 0 },
            { name: "周颖", studyTime: 270 },
            { name: "黄嘉莹", studyTime: 270 },
            { name: "零定煊", studyTime: 240 },
            { name: "谈熹倪", studyTime: 270 },
            { name: "朱明蕊", studyTime: 300 },
            { name: "黄仕洁", studyTime: 0 },
            { name: "刘家铭", studyTime: 0 },
            { name: "覃解语", studyTime: 240 },
            { name: "邹春瑶", studyTime: 240 },
            { name: "黄勇颖", studyTime: 0 },
            { name: "刘平淏", studyTime: 0 },
            { name: "覃莉娇", studyTime: 270 },
            { name: "季中麒", studyTime: 0 },
            { name: "刘翼", studyTime: 240 }
        ];

        let rolling = false;
        let rollInterval;

        function getWeightedStudent() {
            let totalWeight = students.reduce((sum, student) => sum + (1 / (student.studyTime + 1)), 0);
            let random = Math.random() * totalWeight;
            let currentWeight = 0;

            for (let student of students) {
                currentWeight += 1 / (student.studyTime + 1);
                if (random < currentWeight) {
                    return student.name;
                }
            }
        }

        function startRoll() {
            rolling = true;
            rollInterval = setInterval(() => {
                document.getElementById('display').textContent = getWeightedStudent();
            }, 100);
        }

        function stopRoll() {
            clearInterval(rollInterval);
            rolling = false;
        }
    </script>
</body>
</html>